<template>
  <div>
    <div class="auditPeopleDiv">
      <el-select v-model="selectUser" placeholder="请选择" :multiple="true"
                 :filterable="true" style="width: 450px" class="myWorkFlowSysSelect">
        <el-option
          v-for="item in listData"
          :key="item.codeKey"
          :label="item.codeName"
          :value="item.id">
        </el-option>
      </el-select>
    </div>
    <div style="display: inline-block; width: 100%;text-align: right;">
      <el-button size="small" type="success" @click="doSaveSelect()">确定</el-button>
    </div>
  </div>
</template>
<script>
  export default {
    name: 'workFlowSysUserCom',
    data() {
      return {
        selectUser: [],
        auditUser: [],
        loading: false,
        showOverflowTooltip: true,
        listData: []
      }
    },
    props: [],
    created() {
      this.getSysUserList()
    },
    watch: {
    },
    methods: {
      rowClick(row, event, column) {
        // 行单击事件
      },
      cellClick(row, column, cell, event) {
        // 列单击事件
      },
      rowContextmenu(row, column, e) {
        // 右键菜单
        window.event.returnValue = false
      },
      getSysUserList() {
        let args = {}
        args.codeType = 'SYS_USER'
        args.codeStatus = '0'

        this.$store.dispatch('SysCodeListByCodeType', args).then(res => {
          let data = res.data
          if (data && data.length > 0) {
            data.forEach((item, i) => {
              item.id = JSON.stringify({
                'id': item.codeKey,
                'name': item.codeName
              })
            })
          }
          this.listData = data
          this.loading = false
        }).catch((err) => {
          console.log(err)
        })
      },
      doSaveSelect() {
        if (this.selectUser && this.selectUser.length > 0) {
          let auditUser = []
          this.selectUser.forEach((item, i) => {
            let user = JSON.parse(item)
            auditUser.push(user)
          })
          this.$emit('selectCallBack', auditUser)
        } else {
          this.$message({
            type: 'warning',
            message: '请选择人员!'
          })
        }
      }
    }
  }
</script>
<style>
  .myWorkFlowSysSelectOption {
    /*max-height: 200px;*/
    /*overflow-y: auto;*/
  }
</style>
<style scoped>
  .auditPeopleDiv {
    height: 280px;
  }

  .myWorkFlowSysSelect >>> .el-select__tags-text{
    color: limegreen !important;
  }

</style>
